﻿@{
    Layout = null;
    var batchId = ViewBag.batchId;
}
<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1.0" />
<link href="~/Scripts/Bootstrap/css/bootstrap.min.css" rel="stylesheet" />
<style>
    ul li
    {
        list-style: none;
        border-bottom: 1px solid rgb(128, 128, 128);
        padding: 10px;
    }

    #AddInfo
    {
        overflow-y: auto;
    }
</style>
<input type="hidden" id="batchId" value="@batchId" />
<div class="col-xs-12 col-sm-12	col-md-12 col-lg-12">
    <div id="TopNav">
        <div class="row">
            <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 text-right" style="color:#999999">
                产品批次号:<p id="BatchName"></p>
            </div>
            <div class="col-xs-8 col-sm-8 col-md-8 col-lg-8">
            </div>
        </div>
        @*<div class="row">
            <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 text-right" style="color:#999999">
                产品名称:
            </div>
            <div class="col-xs-8 col-sm-8 col-md-8 col-lg-8">
            </div>
        </div>*@
    </div>
    <div id="Title">
        <div style="margin: 0 auto; color: #4caf50;background:#FFFFFF;width:35%;text-align:center;font-size:16px;position:relative;z-index:1">添加任务信息</div>
        <div style="border: 1px solid #4caf50;margin-top:-12px; "></div>
    </div>
    <div id="AddInfo">
        <ul style="margin-top:20px;padding-left:0"  id="TempletNodeList">
            @*<li>
                <div>
                    <span class="text-left">播种</span>
                    <span style="float: right; color: #4caf50;">
                        <span style="padding: 5px; border: 1px solid #4caf50; border-radius: 20px;"><i class="glyphicon glyphicon-plus "></i></span>
                        <span>增加信息</span>
                    </span>
                </div>
            </li>
            <li>
                <div>
                    <span class="text-left">播种</span>
                    <span style="float: right; color: #4caf50;">
                        <span style="padding: 5px; border: 1px solid #4caf50; border-radius: 20px;"><i class="glyphicon glyphicon-plus "></i></span>
                        <span>增加信息</span>
                    </span>
                </div>
            </li>*@
        </ul>
    </div>
    <div class="row" id="bottomRow" style="border-top: 1px solid #E5E5E5; margin: 0; padding-top: 10px;padding-bottom: 30px; position: fixed; bottom: 0; width: calc(100% - 30px); ">
        <div class=" col-xs-3 col-sm-3 col-md-3 col-lg-3">
            <img src="/Content/userImgs/Product/ProductNullImg.png" style="height:55px;width:55px">
        </div>

        <div class=" col-xs-9 col-sm-9 col-md-9 col-lg-9 FlowNodeUlLi">
            <div>老王</div>
            <div>
                操作人：admin
            </div>
            <div>
                18221196274
            </div>
        </div>
    </div>
</div>
<script src="~/Scripts/jquery-3.3.1.min.js"></script>
@*<script src="~/Scripts/jquery.js"></script>*@
<script>
    $(window).ready(function () {
        var AddInfoHeight = document.body.offsetHeight - $("#TopNav").height() - $("#Title").height() - $("#bottomRow").height() - parseFloat($("#bottomRow").css("padding-top")) - parseFloat($("#bottomRow").css("padding-bottom"));
        //console.log(document.body.offsetHeight + " " + $("#TopNav").height() + " " + $("#Title").height() + " " + $("#bottomRow").height() + " " + $("#bottomRow").css("padding-top") + " " + $("#bottomRow").css("padding-bottom"))
        $("#AddInfo").css("height", AddInfoHeight)
    })
</script>


<script type="text/javascript">

    $(document).ready(function () {
        var batchId = $("#batchId").val();
        Binding(batchId);
    });


    function Binding(batchId) {

        $.ajax({
            type: "POST",
            url: "/OriginsNode/GetTempletNodeList",
            dataType: 'json',
            data: { batchId: batchId },
            success: function (data) {
                var html = "";
                if (data.length > 0) {
                    for (var i = 0; i < data.length; i++) {
                        html+= '<li>',
                        html+= '<div>',
                        html+='<span class="text-left">'+data[i].NodeName+'</span>'
                        html+='<span style="float: right; color: #4caf50;">',
                        html+= '<span style="padding: 5px; border: 1px solid #4caf50; border-radius: 20px;"><i class="glyphicon glyphicon-plus "></i></span>',
                        html+= '<span data-nodeId="'+data[i].Id+'"  onclick="AddNode(this)" >增加信息</span>',
                        html+= '</span>',
                        html+= '</div>',
                        html+= '</li>'
                    }
                    $("#TempletNodeList").html(html);
                }
            },
            error: function (e) {
                $.L.msgError("network error");
            }
        });
    }
    

    function AddNode(obj) {

        var nodeId = $(obj).attr("data-nodeId");
        var batchId = $("#batchId").val();
        window.location = "/Mobile/AddNodeInfo?nodeId=" + nodeId + "&batchId=" + batchId;

    }





</script>